<template>
  <div class="sop_management">
    <div v-for="itemP in list" :key="itemP.type">
      <Row class="label_warp">
        <Col span="6" class="label_txt">{{ itemP.label }}</Col>
        <Col span="18" class="tips">
          <Icon type="md-alert" class="tips_icon" />
          提示：{{ itemP.tips }}
        </Col>
      </Row>
      <Row type="flex" justify="start" class="sop_content">
        <Col span="8" v-for="(item, index) in itemP.SopSort" :key="index">
          <Row type="flex" justify="start" class="item_class">
            <Col span="8">
              {{ item.sopName }}
            </Col>
            <Col span="6" v-if="item.isTaskShowBtn">
              <i-switch
                size="large"
                v-model="item.isTaskAssess"
                @on-change="changeTaskSwitch(item)">
                <span slot="open">{{ item.openTaskTxt }}</span>
                <span slot="close">{{ item.closeTaskTxt }}</span>
              </i-switch>
            </Col>
            <Col span="6" v-if="item.isShowBtn">
              <i-switch
                size="large"
                v-model="item.isAssess"
                @on-change="changeSwitch(item)"
                :disabled="
                  itemP.flag ||
                  (item.isTaskShowBtn ? !item.isTaskAssess : false)
                ">
                <span slot="open">{{ item.openTxt }}</span>
                <span slot="close">{{ item.closeTxt }}</span>
              </i-switch>
            </Col>
            <Col span="4" v-if="item.isRule">
              <div class="special_rules" @click="onCreateRule(item)">
                特殊规则
              </div>
            </Col>
          </Row>
        </Col>
      </Row>
    </div>

    <set-rules ref="edit" @success="onSuccess"></set-rules>
    <check-rules ref="check" @success="onSuccess"></check-rules>
    <dt-loading :loading="loading" />
  </div>
</template>

<script>
  import setRules from './components/setRules'
  import checkRules from './components/checkRules'
  import sopApi from '@/biz/buildingManagement/sopConfig'
  import buildingApi from '@/biz/buildingManagement/basicInfo'

  export default {
    components: {
      setRules,
      checkRules
    },
    data() {
      return {
        SopSort: [],
        list: [
          {
            label: '任务配置',
            type: '1',
            flag: false,
            tips: '修改任务配置后，即时生效',
            SopSort: []
          },
          {
            label: '扣分项配置',
            type: '3',
            flag: false,
            tips: '修改扣分项配置后，即时生效',
            SopSort: []
          },
          {
            label: '订单附件配置',
            type: '2',
            flag: false,
            tips: '修改后只对新产生的订单生效',
            SopSort: []
          },
          {
            label: '奖金配置',
            type: '4',
            flag: false,
            tips: '修改后即时生效',
            SopSort: []
          },
          {
            label: '加分项配置',
            type: '5',
            flag: false,
            tips: '修改加分项配置后，即时生效',
            SopSort: []
          }
        ],
        loading: false,
        noAvailSopList: null
      }
    },
    methods: {
      changeTaskSwitch(data) {
        console.log(data)
        if (!data.isTaskAssess) {
          data.isAssess = false
        }
        this.changeSwitch(data, true)
      },
      changeSwitch(data, flag) {
        console.log(data, flag, '1111111111111111')
        let params = {
          configId: data.id,
          isAssess: data.isAssess ? 1 : 0 //打开还是关闭审核 1 考核 0 不考核
        }
        if (flag) {
          params.isTaskAssess = data.isTaskAssess ? 1 : 0
        }
        // sopApi.auditSwitch(params).then((res) => {
        sopApi.buildingAuditPlatformSwitch(params).then((res) => {
          this.$Message.success('修改成功')
          console.log(res)
        })
      },
      onCreateRule(data) {
        console.log(data, '1111是否编辑')
        if (data.isEdit) {
          this.$refs.edit.show(data)
        } else {
          this.$refs.check.show(data)
        }
      },
      onSuccess() {
        this.init()
      },
      init() {
        this.loading = true
        let params = {
          buildingId: this.$dt.buildInfo().housesId
        }
        // sopApi.getBuildingSopConfig(params).then(res => {
        sopApi
          .sopSettingBuildingList(params)
          .then((res) => {
            this.list[0].SopSort = []
            this.list[1].SopSort = []
            res &&
              res.forEach((item, index) => {
                if (item.type == 1) {
                  this.list[0].SopSort.push(item)
                } else if (item.type == 2) {
                  this.list[2].SopSort.push(item)
                } else if (item.type == 3) {
                  this.list[1].SopSort.push(item)
                } else if (item.type == 4) {
                  this.list[3].SopSort.push(item)
                }else if (item.type == 5) {
                  this.list[4].SopSort.push(item)
                }
              })
            this.list.forEach((item) => {
              item.SopSort = this.$tool.bubbleSort(item.SopSort, 'sort')
            })
            this.loading = false
          })
          .catch(() => {
            this.loading = false
          })
      }
      //获取案场状态 撤场/结案时不可修改
      // getBuildDetail() {
      //   let params = {
      //     housesId: this.$dt.buildInfo().housesId,
      //     type_version: 'sop'
      //   }
      //   buildingApi.housesGetDetail(params).then((res) => {
      //     if (res.status == 5 || res.status == 6) {
      //       this.list[0].flag = true;
      //       this.list[1].flag = true;
      //     }
      //   })
      // },
    },
    created() {
      // this.getBuildDetail()
      this.init()
    }
  }
</script>
<style lang="scss" scoped>
  .sop_management {
    .label_warp {
      padding: 0 10px;

      .label_txt {
        font-size: 18px;
      }

      .tips {
        text-align: right;
        line-height: 32px;
        width: 100%;

        .tips_icon {
          font-size: 20px;
          color: #0f42a7;
        }
      }
    }

    .ivu-switch-large {
      width: 80px;
      height: 30px;
      line-height: 30px;
    }

    ::v-deep .ivu-switch .ivu-switch-inner {
      left: 30px;
    }

    ::v-deep .ivu-switch-checked .ivu-switch-inner {
      left: 7px;
    }

    .ivu-switch-large.ivu-switch-checked:after {
      left: 50px;
      height: 26px;
      width: 26px;
    }

    .ivu-switch:after {
      height: 26px;
      width: 26px;
    }

    .sop_content {
      border: 1px solid #ccc;
      border-radius: 5px;
      margin-bottom: 30px;

      .item_class {
        padding: 15px;
        font-size: 16px;
        line-height: 30px;
      }

      .special_rules {
        color: #0f42a7;
        cursor: pointer;
      }
    }
  }
</style>
